<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8"/>
    <title>加入租户</title>
    <link href="../../assets/lib/layui/css/layui.css" rel="stylesheet"/>
    <link href="../../assets/lib/winui/css/winui.css" rel="stylesheet"/>
    <style>
        .form-container {
            max-width: 800px;
            margin: 30px auto;
            padding: 30px;
            border: 1px solid #e6e6e6;
            box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
            border-radius: 4px;
            background-color: #fff;
        }

        /* 成功加入蒙版样式 */
        .success-mask {
            width: 100%;
            height: 100%;
            background-color: rgba(0, 0, 0, 0.7);
            z-index: 9999;
            display: flex;
            justify-content: center;
            align-items: center;
            display: none; /* 初始隐藏 */
        }

        .success-content {
            position: fixed;
            top: 0;
            left: 0;
            right: 0;
            bottom: 0;
            margin: auto;
            background-color: #fff;
            padding: 30px;
            border-radius: 5px;
            display: flex;
            flex-direction: column;
            justify-content: center;
            align-items: center;
            max-width: 400px;
            max-height: 200px;
        }

        .success-title {
            font-size: 24px;
            color: #333;
            margin-bottom: 15px;
        }

        .success-message {
            font-size: 16px;
            color: #666;
        }

        /* 清除浮动，防止内容溢出容器 */
        .clearfix:after {
            content: "";
            display: table;
            clear: both;
        }
    </style>
</head>
<body>
<!-- 成功加入蒙版，初始隐藏 -->
<div id="successMask" class="success-mask">
    <div class="success-content">
        <div class="success-title">加入租户成功</div>
        <div class="success-message">您已成功加入租户，请联系管理员获取更多信息。</div>
    </div>
</div>

<div class="form-container">
    <form class="layui-form clearfix" action="" id="showForm" autocomplete="off">
        <div class="layui-row">
            <div class="layui-col-xs12">
                <div class="layui-form-item">
                    <span class="hr-title">加入租户</span>
                    <hr>
                </div>
            </div>
        </div>
        <!-- 隐藏字段用于保存邀请ID -->
        <input type="hidden" id="inviteId" name="inviteId"/>
        <div class="layui-row">
            <div class="layui-col-xs6">
                <div class="layui-form-item">
                    <label class="layui-form-label">姓名<i class="red">*</i></label>
                    <div class="layui-input-block">
                        <input type="text" id="userName" name="userName" win-verify="required" placeholder="请输入姓名"
                               class="layui-input" maxlength="20"/>
                    </div>
                </div>
            </div>
            <div class="layui-col-xs6">
                <div class="layui-form-item">
                    <label class="layui-form-label">性别<i class="red">*</i></label>
                    <div class="layui-input-block winui-radio">
                        <input type="radio" name="userSex" value="1" title="男" checked/>
                        <input type="radio" name="userSex" value="2" title="女"/>
                    </div>
                </div>
            </div>
        </div>
        <div class="layui-row">
            <div class="layui-col-xs6">
                <div class="layui-form-item">
                    <label class="layui-form-label">身份证号<i class="red">*</i></label>
                    <div class="layui-input-block">
                        <input type="text" id="userIdCard" name="userIdCard" win-verify="required|identity"
                               placeholder="请输入身份证号" class="layui-input" maxlength="18"/>
                    </div>
                </div>
            </div>
            <div class="layui-col-xs6">
                <div class="layui-form-item">
                    <label class="layui-form-label">密码<i class="red">*</i></label>
                    <div class="layui-input-block">
                        <input type="password" id="password" name="password" win-verify="required"
                               placeholder="请输入密码" class="layui-input" maxlength="20"/>
                    </div>
                </div>
            </div>
        </div>
        <div class="layui-row">
            <div class="layui-col-xs12">
                <div class="layui-form-item">
                    <div class="layui-input-block">
                        <button class="winui-btn" lay-submit lay-filter="formJoin">同意加入</button>
                    </div>
                </div>
            </div>
        </div>
    </form>
</div>
<script src="../../assets/lib/layui/layui.js"></script>
<script src="../../assets/lib/layui/custom.js"></script>
<script type="text/javascript">
    layui.config({base: '../../js/tenant/'}).use('joinTenant');
</script>
</body>
</html>
